<template>
 <div id="contact-person">
  <div class="_SessionItem_dnmx0_1">
    <div class="_SessionItem__Avatar_dnmx0_21">
      <div class="bili-avatar" style="width: 40px; height: 40px;">
        <el-avatar  :size="40" src="/public/a/avatar.png"></el-avatar>
      </div>
      <div class="_SessionItem__Main_dnmx0_42">
        <div class="_SessionItem__Title_dnmx0_49">
          <div class="_SessionItem__Name_dnmx0_67">MrBeast官方账号</div>
        </div>
        <div class="_SessionItem__Info_dnmx0_97">
          <div class="_SessionItem__Message_dnmx0_107">[自动回复]感谢你的关注！一定要多多支持啊！Subscrib...</div>
        </div>
      </div>
    </div>
  </div>
 </div>

</template>
<script setup>
import { ElAvatar } from 'element-plus';




</script>
<style scoped>
._SessionItem_dnmx0_1 {
  width: 100%;
  padding: 19px 12px 19px 24px;
  position: relative;
  display: flex;
  cursor: pointer;
  box-sizing: border-box;
}
._SessionItem__Avatar_dnmx0_21 {
  display: flex;
   gap: 5px;
  position: relative;
  width: 100%;
  margin-right: 8px;
  flex-shrink: 0;
}
._SessionItem__Main_dnmx0_42 {
    flex: 1;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
._SessionItem__Tag_dnmx0_53, ._SessionItem__Title_dnmx0_49 {
    display: flex;
    align-items: center;
}
._SessionItem__Info_dnmx0_97 {
    display: flex;
    align-items: center;
    font-size: 12px;
    line-height: 18px;
}
._SessionItem__Message_dnmx0_107 {
    flex: 1;
    overflow: hidden;
    color: #9499A0;
    text-overflow: ellipsis;
    white-space: nowrap;
}
</style>